<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>待提交</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.css">
	
		<style>
			.mui-card .mui-control-content {
				padding: 10px;
			}
			
			.mui-control-content {
				height: 500px;
			}
		</style>
	</head>

	<body>

		<div class="mui-content" id ="chat">
			<div style="padding: 10px 10px;">
				<div id="segmentedControl" class="mui-segmented-control">
					<a class="mui-control-item mui-active" href="#item1">环境表单</a>
					<a class="mui-control-item" href="#item2">种植/养殖表单</a>
				</div>
			</div>
			<div>
				<div id="item1" class="mui-control-content mui-active">
					<div id="scroll" class="mui-scroll-wrapper">
						<div class="mui-scroll">
							<ul class="mui-table-view">
								<li class="mui-table-view-cell" v-for="item in env">
									{{item.name}}
									<button class="mui-btn mui-btn-gray" style="margin-right: 60px;" @click="toenv(item.id)">
									去提交
									</button>
									<button class="mui-btn mui-btn-danger" style="display: inline-block;" @click="deleteenv(item.id)">
									删除
									</button>
								</li>
								
							</ul>
						</div>
					</div>
				</div>
				<div id="item2" class="mui-control-content">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" v-for="item in info">
							{{item.name}}
							<button class="mui-btn mui-btn-gray" style="margin-right: 60px;" @click="toinfo(item.id)">
							去提交
							</button>
							<button class="mui-btn mui-btn-danger" style="display: inline-block;" @click="deleteinfo(item.id)">
							删除
							</button>
						</li>
					
					</ul>
				</div>
			</div>
		
		</div>
				<script src="../js/resource/mui.js"></script>
		<script src="../js/resource/vue.js"></script>
		<script src="../js/resource/config.js"></script>	
		<script src="../js/chat.js"></script>
		<script>
			mui.init({
				swipeBack: true //启用右滑关闭功能
			});
			(function($) {
				$('#scroll').scroll({
					indicators: true //是否显示滚动条
				});
				var segmentedControl = document.getElementById('segmentedControl');
				$('.mui-input-group').on('change', 'input', function() {
					if (this.checked) {
						var styleEl = document.querySelector('input[name="style"]:checked');
						var colorEl = document.querySelector('input[name="color"]:checked');
						if (styleEl && colorEl) {
							var style = styleEl.value;
							var color = colorEl.value;
							segmentedControl.className = 'mui-segmented-control' + (style ? (' mui-segmented-control-' + style) : '') + ' mui-segmented-control-' + color;
						}
					}
				});
			})(mui);
		</script>

	</body>

</html>